const path = require('path');

const webpack = require('webpack')

const HtmlWebpackPlugin = require('html-webpack-plugin') 

// const UglifyjsWebpackPlugin = require('uglifyjs-webpack-plugin');

// const { VueLoaderPlugin } = require('vue-loader');

module.exports = {
    entry: './src/main.js',
    output: {
        path: path.resolve(__dirname, 'dist'),
        filename: 'bundle.js',
        // publicPath: 'dist/'
    },
    module: {
        rules: [
            {
              test: /\.css$/,
              use: ['style-loader', 'css-loader']
            },
            {
              test: /\.less$/,
              use: [{
                loader: 'style-loader' // creates style nodes from JS strings
              }, {
                loader: 'css-loader' // translates CSS into CommonJS
              }, {
                loader: 'less-loader' // compiles Less to CSS
              }]
            },
            {
              test: /\.(png|jpg|gif|jpeg)$/i,
              use: [
                {
                  loader: 'url-loader',
                  options: {
                    limit: 8192,
                    name: 'img/[name].[hash:8].[ext]'
                  },
                }
              ]
            },
            {
              test: /\.m?js$/,
              exclude: /(node_modules|bower_components)/,
              use: {
                loader: 'babel-loader',
                options: {
                  presets: ['es2015']
                }
              }
            },
            {
              test: /\.vue$/,
              use: ['vue-loader']
            }

          ]
    },
    resolve: {
      alias: {
        'vue$': 'vue/dist/vue.esm.js'
      }
    },
    plugins: [
      new webpack.BannerPlugin('最终版权归leon所有'),
      new HtmlWebpackPlugin({
        template: 'index.html'
      }),
      // new UglifyjsWebpackPlugin()
    ],
    derServer: {
      contentBase: './dist',
      inline: true
    }
}